

<!doctype html>
<html ng-app>
<head>
    <script src="http://code.angularjs.org/1.2.25/angular.min.js"></script>
    <script src="http://code.angularjs.org/1.2.25/angular-animate.min.js"></script>
    <script type="text/css">
        .css-class-add, .css-class-remove {
            -webkit-transition:all cubic-bezier(0.250, 0.460, 0.450, 0.940) 0.5s;
            -moz-transition:all cubic-bezier(0.250, 0.460, 0.450, 0.940) 0.5s;
            -o-transition:all cubic-bezier(0.250, 0.460, 0.450, 0.940) 0.5s;
            transition:all cubic-bezier(0.250, 0.460, 0.450, 0.940) 0.5s;
        }

        .css-class,
        .css-class-add.css-class-add-active {
            color: red;
            font-size:3em;
        }

        .css-class-remove.css-class-remove-active {
            font-size:1.0em;
            color:black;
        }
    </script>
</head>
<body>
<p>
    <input type="button" value="设置" ng-click="myCssVar='css-class'">
    <input type="button" value="清除" ng-click="myCssVar=''">
    <br>
    <span ng-class="myCssVar">CSS-动画文本</span>
</p>
</body>
</html>

